<template>
    <div>
        <div class="form-section">
            <div class="form-item  form-item-style1">
                <div class="label-title">
                    <label>通知标题</label>
                    <i class="iconfont icon-required"></i>
                </div>
                <div>
                    <p>{{informDetail.Title}}</p>
                </div>
            </div>
            <div class="form-item form-item-style2">
                <div class="label-title space-between">
                    <div class="space-between">
                        <label>发布范围</label>
                        <i class="iconfont icon-required"></i>
                    </div>
                    <span @click="unfoldMeasure = !unfoldMeasure">{{unfoldMeasure?'收起': '展开'}}</span>
                </div>
                <div>
                    <p class="textarea"
                       :class="{'unfold':unfoldMeasure}">{{informDetail.IssueDeptName}}</p>
                </div>
            </div>
            <div class="form-item form-item-style2">
                <div class="label-title space-between">
                    <div class="space-between">
                        <label>通知内容</label>
                        <i class="iconfont icon-required"></i>
                    </div>
                </div>
                <div>
                    <p class="textarea">{{informDetail.Content}}</p>
                </div>
            </div>
            <div class="form-item  form-item-style1">
                <div class="label-title">
                    <label>重要通知</label>
                    <i class="iconfont icon-required"></i>
                </div>
                <div>
                    <p>{{informDetail.IsImportant?'是':'否'}}</p>
                </div>
            </div>
            <div class="form-item  form-item-style1">
                <div class="label-title">
                    <label>发布人</label>
                </div>
                <div>
                    <p>{{informDetail.Issuer}}</p>
                </div>
            </div>
            <div class="form-item  form-item-style1">
                <div class="label-title">
                    <label>发布日期</label>
                </div>
                <div>
                    <p>{{informDetail.IssueTime}}</p>
                </div>
            </div>
        </div>
        <div class="cut-off-rule"></div>
        <div class="form-section">
            <div class="form-item form-item-style2">
                <div class="label-title space-between">
                    <label>图片</label>
                    <span>当前共{{informDetail.Url?informDetail.Url.length:0}}张图片</span>
                </div>
                <div class="upload-wrap">
                    <upload v-if="informDetail.Url&&informDetail.Url.length>0"
                            :imgList="informDetail.Url"></upload>
                    <strong v-else
                            class="no-img">暂无图片</strong>
                </div>
            </div>
        </div>
        <myMenu></myMenu>
    </div>
</template>
<script>
import upload from '@/commonComponents/upload/index'
import myMenu from '@/commonComponents/menu'
export default {
    name: 'informDetail',
    components: {
        myMenu,
        upload
    },
    data () {
        return {
            unfoldMeasure: false,
            userInfo: '',
            informDetail: {}
        }
    },
    created () {
        this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
        this.getDetail()
    },
    methods: {
        getDetail () {
            var params = {
                'business': 'AfficheDetails',
                'data': {
                    id: this.$route.query.id
                },
                'userId': this.userInfo.userid
            }

            this.$axiosAjax.getConfigJson(params)
                .then((res) => {
                    if (res.data.code === 0) {
                        this.informDetail = res.data.data
                    }
                }).catch((response) => {
                })
        }
    }
}
</script>
<style scoped>
</style>
